<table id="list" class="scroll"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>

<script type="text/javascript">
jQuery('#list').jqGrid({
	url:'/catalog/fields/values/format/json?searchOper=eq&searchField=FIELDSVALUES_FIELDID&searchString=<?php echo $this->fieldId;?>&fid=<?php echo $this->fieldId;?>',
	datatype: 'json',
	mtype: 'GET',
	colNames:['Id', 'Field', 'Value'],
	colModel :[
	  {name:'FIELDSVALUES_ID', index:'FIELDSVALUES_ID', sorttype:'int', width:50},
	  {name:'FIELDSVALUES_FIELDID', index:'FIELDSVALUES_FIELDID', editable:false, editrules:{required:true}},
	  {name:'FIELDSVALUES_VALUE', index:'FIELDSVALUES_VALUE', editable:true, editrules:{required:true}}],
	pager: jQuery('#pager'),
	rowNum:20,
	rowList:[20, 40, 60, 80, 100, 150, 200],
	sortname: 'FIELDSVALUES_ID',
	sortorder: 'asc',
	viewrecords: true,
	caption: 'Field Values View',
	editurl: '/catalog/fields/valuesedit/fid/<?php echo $this->fieldId;?>',
	height:'auto',
	width:'600'
}).navGrid('#pager',{
	edit:true, add:true, del:true, search:false
});
</script>
